﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="MyForm.aspx.cs" Inherits="JsonSubmitForm.MyForm" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>My Form</title>
    <link href="Style/style.css" rel="stylesheet" />
    <link href="Style/flick/jquery-ui-1.10.1.custom.min.css" rel="stylesheet" />
    <script src="Script/jquery-1.9.0.min.js"></script>
    <script src="Script/jquery-ui-1.10.1.custom.min.js"></script>
    <script src="Script/myquery.js"></script>
</head>
<body>
    <form id="form1" runat="server">
    <div id="formfield">
        <div id="divMsg"></div>
        <div id="tbform">
            <h2>New Employee Record</h2>
            <input id="hfID" type="hidden" />
            <img id="photo" alt="Employee Photo" title="Employee Photo" src="" />
            <table>
                <tr>
                    <td>First Name :</td>
                    <td><asp:TextBox ID="FirstName" runat="server" /></td>
                </tr>
                <tr>
                    <td>Middle Name :</td>
                    <td><asp:TextBox ID="MiddleName" runat="server" /></td>
                </tr>
                <tr>
                    <td>Last Name :</td>
                    <td><asp:TextBox ID="LastName" runat="server" /></td>
                </tr>
                <tr>
                    <td>Title :</td>
                    <td>
                        <asp:DropDownList ID="Title" runat="server">
                            <asp:ListItem Text="Select one" Value="0" />
                            <asp:ListItem Text="Mr" Value="1" />
                            <asp:ListItem Text="Mrs" Value="2" />
                            <asp:ListItem Text="Ms" Value="3" />
                        </asp:DropDownList>
                    </td>
                </tr>
                <tr>
                    <td>Position :</td>
                    <td><asp:TextBox ID="Position" runat="server" /></td>
                </tr>
                <tr>
                    <td>Joined Date :</td>
                    <td>
                        <input type="text" id="JoinedDate" name="JoinedDate" />
                    </td>
                </tr>
                <tr>
                    <td>EmployeeID :</td>
                    <td><asp:TextBox ID="EmployeeID" runat="server" /></td>
                </tr>
                <tr>
                    <td colspan="2" style="text-align: right;">
                        <button id="clear" type="reset">Reset</button>&nbsp;&nbsp;<button id="btnSubmit" type="button">Save New Employee Record</button>
                    </td>
                </tr>
            </table>
        </div>
        <div>
            <asp:Label ID="lblStatus" runat="server"></asp:Label>
        </div>
        <div id="upload">
            <iframe src="UploadPhoto.aspx" class="upload"></iframe>
        </div>

    </div>
    <div id="viewemployee">
        <h2>Employee List</h2>
        <div>
            <button id="btnLoadList" class="btnLoadList" type="button">Load Employee List</button>
        </div>
        <div>
            <table id="tbEmpList" class="employeelist">
                <tr>
                    <td>No.</td>
                    <td>Name</td>
                    <td>Title</td>
                    <td>Position</td>
                    <td>Joined Date</td>
                    <td>Employee ID</td>
                    <td>Action</td>
                </tr>
            </table>
        </div>
    </div>
    <div id="loading">
        <div id="loader">
            <img src="Image/loading.gif" style="vertical-align: text-top;" />
            <br />
            Processing data...Please wait
        </div>
    </div>
    </form>
</body>
</html>
